<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户注册</title>
</head>

<body>
    <div id="app">
        <form action="#" method="POST" id="reg-form">
            <fieldset>
                <legend>用户注册</legend>
                <div class="form-control">
                    <label for="username">账号 </label>
                    <input type="text" id="username" name="username" autofocus autocomplete="off" placeholder="请输入账号" value="admin" readonly>
                </div>
                <div class="form-control">
                    <label for="password">密码 </label>
                    <input type="password" id="password" name="password" placeholder="请输入密码">
                </div>

                <div class="form-control">
                    <label for="female">性别 </label>
                    <input type="radio" id="female" value="0" name="gender">女
                    <input type="radio" id="male" value="1" name="gender" checked>男
                </div>

                <div class="form-control">
                    <label for="music">爱好 </label>
                    <input type="checkbox" value="音乐" name="hobbies" id="music">音乐
                    <input type="checkbox" value="上网" name="hobbies" id="network" checked>上网
                </div>


                <div class="form-control">
                    <label for="position">职业 </label>
                    <select name="position" id="position" size="3" multiple>
                        <option value="工程师" selected>工程师</option>
                        <option value="教师" selected>教师</option>
                        <option value="律师">律师</option>
                    </select>
                </div>

                <div class="form-control">
                    <label for="income">收入</label>
                    <select name="income" id="income">
                        <option value="0">请选择收入</option>
                        <option value="1000-3000">1000-3000元</option>
                        <option value="3000-4000">3000-4000元</option>
                        <option value="4000-5000" selected>4000-5000元</option>
                        <option value="5000">5000元以上</option>
                    </select>
                </div>

                <div class="form-control">
                    <label for="email">邮箱</label>
                    <input type="email" placeholder="请输入电子邮件地址" name="email" id="email">
                </div>

                <div class="form-control">
                    <label for="dob">生日</label>
                    <input type="date" id="dob" name="dob">
                </div>

                <div>
                    <label for="blogUrl">博客</label>
                    <input type="url" id="blogUrl" name="blogUrl" placeholder="请输入博客地址">
                </div>

                <div class="form-control">
                    <label for="age">年龄</label>
                    <input type="number" min="1" max="120" step="1" id="age" name="age" value="18">
                </div>
                <div>
                    <label for="avatar">头像</label>
                    <input type="file" name="pic" id="pic" accept="image/gif, image/jpeg,image/png" multiple>
                </div>
                <div class="form-control">
                    <label for="jobAge">工龄</label>
                    <input type="range" min="1" max="50" step="1" id="jobAge" name="jobAge" value="3">
                </div>
                <div class="form-control">
                    <label for="intro">简介</label>
                    <textarea placeholder="请填写个人简介" style="resize: none;" rows="8" cols="60"></textarea>
                </div>
                <div class="form-control">
                    <input type="submit" value="注册" id="reg-btn">
                    <input type="reset" value="重置" id="reset-btn">
                    <input type="button" value="返回" id="back-btn" disabled>
                    <input type="image" src="img/renren.gif" id="submit-btn">

                    <button type="submit" id="sign-up-btn">注册</button>
                    <button type="reset" id="clear-btn">重置</button>
                    <button type="button" id="return-btn">返回</button>
                </div>
            </fieldset>
        </form>
    </div>
</body>

</html>